<template>
	<view class="myreg">
		<view class="title">注册</view>
		<view class="login_wrap">
				<u--form
						labelPosition="left"
						:model="formObj"
						:rules="rules"
						ref="uForm"
					>
						<u-form-item
								ref="item1"
								prop="userName"
						>
							<u--input
								v-model="formObj.userName"
									placeholder="用户名"
									
									 
							></u--input>
						</u-form-item>
						<u-form-item
								ref="item1"
									prop="email"
						>
							<u--input
								v-model="formObj.email"
									placeholder="邮箱"
							></u--input>
						</u-form-item>
						<u-form-item
								ref="item1"
						>
							<u--input
								prop="phone"
									v-model="formObj.phone"
									placeholder="手机号"
							></u--input>
						</u-form-item>
						<u-form-item
								ref="item1"
								prop="userPwd"
						>
							<u--input
								placeholder="密码"
								v-model="formObj.userPwd"
							></u--input>
						</u-form-item>
						<u-form-item>
							<u-button type="success" @click="toReg"> 注册</u-button>
						</u-form-item>
					</u--form>
		</view>
	</view>
</template>

<script>
	import {toRegApi} from '@/api/common.js'
	export default {
		data(){
			return {
				formObj:{
					userName:"",		//用户名
					email:"",		 //邮箱
					phone:"",		  //手机号
					userPwd	:""	,   //密码
					nickname:"",		//名字（暂时未设置，必填项，传空''）
					userPic:"",		//头像图片（暂时未设置，必填项，传空''）

				},
				rules:{
					userName:{
						type:'string',
						required: true,
						message: '请填写用户名',
						trigger: ['blur'],
					},
					email:{
						type:'string',
						pattern: /^[_a-z0-9-]+(\.[_a-z0-9-]+)*@[a-z0-9-]+(\.[a-z0-9-]+)*(\.[a-z]{2,})$/,
						message: '邮箱',
						trigger: ['blur'],
					},
					phone:{
						type:'string',
						required: true,
						message: '手机号必填',
						trigger: ['blur'],
					},
					userPwd:{
						type:'string',
						min: 3,
						max:10,
						message: '密码3-10位',
						trigger: ['blur'],
					}
				}
			}
		},
		methods:{
			 toReg(){
				 // 表单验证通过后调用注册接口
				this.$refs.uForm.validate().then(async ()=>{
					let res=await toRegApi(this.formObj)
					
					console.log(res);
					if(res.success){
						uni.showToast({
							title:"注册成功"
						})
						uni.navigateTo({
							url:"/pages/mine/login"
						})
					}
				})
					
			}
		}
	}
</script>

<style lang="scss">
	.title{
		font-size: 20px;
		margin-top: 20px;
	}
	.login_wrap{
		padding: 30px;
		box-sizing: border-box;
	}
	.myreg{
		width:100vw;
		height: 100vh;
		background: url(	https://img2.baidu.com/it/u=44901648,680771766&fm=253&fmt=auto&app=138&f=JPEG?w=500&h=889);
	}
</style>